<script setup lang="ts">

import Model2 from "@/components/Model2.vue";
import Ring from "./Ring.vue";
import RoundCake from "./RoundCake.vue";
</script>

<template>
<!--  :gutter 表示列之间的间距-->
  <el-row class="top" :gutter="20">
<!--    :span 表示宽度-->
    <el-col :span="8">
      <Model2></Model2>
    </el-col>
    <el-col :span="8">
      <Model2>
        <template v-slot:title>访问来源</template>
        <template v-slot:container><Ring></Ring></template>
      </Model2>

    </el-col>
    <el-col :span="8">
      <Model2>
        <template v-slot:title>访问来源</template>
        <template v-slot:container><RoundCake></RoundCake></template>
      </Model2>

    </el-col>
  </el-row>
</template>

<style scoped>
.top {
  margin-top: 30px;
}
</style>